<template>
	<div class="hotPc">
		<button @click="goAdd()">添加</button>
		<el-table :data="tableData" :row-class-name="tableRowClassName">
			<el-table-column prop="memo" label="介绍" width="180">
			</el-table-column>
			<el-table-column prop="type" label="类型">
			</el-table-column>
			<el-table-column prop="hot" label="热度">
			</el-table-column>
			<el-table-column label="图片" min-width="100">
				<template slot-scope="scope">
					<div style="width: 140px; height: 100px;">
						<img :src="`http://127.0.0.1/api/public/showimg/${scope.row.picture}`"
							style="width: 100%;height: 100%;" />
					</div>
				</template>
			</el-table-column>
			<el-table-column fixed="right" label="修改" min-width="60">
				<template slot-scope="scope">
					<el-button type="primary" size="small" icon="el-icon-edit" @click="goupdate(scope.row.id)">修改</el-button>
				</template>
			</el-table-column>
			<el-table-column fixed="right" label="删除" min-width="60">
				<template slot-scope="scope">
					<el-button type="primary" size="small" icon="el-icon-edit" @click="goremove(scope.row.id)">删除</el-button>
				</template>
			</el-table-column>
		</el-table>
		
	</div>
</template>

<script>
	export default {
		name:'hotPic',
		data() {
			return {
				tableData: [],
				hot:{},
				act:2,
				hots: {
					id: 0
				},
			}
		},
		methods: {
			goAdd() {
				this.$router.push({
					path: '/PC/addPic',
					query: {
						hot: this.hots
					}
				})
			},
			goupdate(id) {
				console.log(id);
				this.$router.push({
					path: '/PC/updatePic',
					query:{
						hot:id
					}
				})
			},
			goremove(id){
				let token = window.localStorage.getItem("token")
				let _this = this
				console.log(id);
				this.$get("/api/adm/hot/remove/" + id)
					.then((resp) => {
						_this.tableData= resp.data.data;
						console.log(_this.tableData);
					})
			},
			tableRowClassName({
				row,
				rowIndex
			}) {
				if (rowIndex === 1) {
					return 'warning-row';
				} else if (rowIndex === 3) {
					return 'success-row';
				}
				return '';
			}
		},
		mounted() {
			this.$get("/api/public/findHot/1/10").then((resp) => {
				this.tableData = resp.data.data
				console.log(resp.data.data);
				console.log(this.tableData);
			})
		}
	}
</script>

<style scoped>
	.hotPc{
		width: 100%;
	}
</style>